<style type="text/css">
.ui-jqgrid-sortable {
	text-align: center;
}
</style>

<div id="courtRoleBind_container">
	<div class="row">
		<div class="col-xs-12">



			<table id="courtRoleBind_grid-table"></table>

			<div id="courtRoleBind_grid-pager"></div>

		</div>
		<!-- /.col -->
	</div>
	<!-- /.row -->


	<div id="courtRoleBindModalDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span id="courtRoleBindTitle">添加角色</span>
					</div>
				</div>
				<div class="modal-body"
					style="max-height: 450px; overflow-y: scroll;">
					<div id="modal-tip" class="red clearfix"></div>
					<form id="courtRoleBindForm" name="courtRoleBindForm"
						class="form-horizontal  col-xs-12">
						<div class="widget-box  ui-sortable-handle">
							<div class="widget-header">
								<h4 class="widget-title">基本信息</h4>
							</div>
							<div class="widget-body">
								<input type="hidden" name="id" id="courtRoleBindId" />
								<div class="widget-main">
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">门牌号</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="courtRoleBindDoorplate"
													name="doorplateNo" disabled="disabled" style="display:inline;"/>
												<input type="hidden" id="courtRoleBindDoorplateId" name="doorPlateId"/>
												<i class="ace-icon fa fa-search-plus fa-10x red" onClick="choseRoleBindDoorplate()" style="margin-left:10px;"></i>
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">角色名称</label>
											<div class="col-sm-9">
												<select class="form-control" id="roleChoseSelect" name="roleId">
												</select>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">

						<button id="submitcourtRoleBindBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>

						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	
	<div id="checkCourtRoleBindDoorplateGridDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>选择门牌号</span>
					</div>
				</div>
				<div class="modal-body" style="max-height: 750px; overflow-y: scroll;">
					<div class="row">
						<div class="col-xs-12">
							<div id="searchCourtRoleBindDoorplate_box" class="widget-box  ui-sortable-handle collapsed">
								<div class="widget-header">
									<div class="nav-search" style="padding-top: 4px; left: 25px">
										<span class="input-icon"> 
										<input type="text" id="CourtRoleBindDoorplateProprietorName" 
											placeholder="请输入业主姓名" class="nav-search-input"> 
										<i class="ace-icon fa fa-search nav-search-icon"></i>
										</span>
									</div>
									
									<div id="searchCourtRoleBindDoorplateDiv" class="input-group col-xs-12  col-sm-6  "
										style="width:50px;top: 1px;float:right;">
										<span class="input-group-btn">
											<button id="searchCourtRoleBindDoorplateBtn" type="button"
												class="btn btn-purple btn-sm">
												<span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
												<span i18n="find"></span>
											</button>
										</span>
									</div>
								</div>
							</div>
							<table id="courtRoleBindDoorplate_grid-table"></table>
							<div id="courtRoleBindDoorplate_grid-pager"></div>
						</div>
					</div>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">
						<button id="submitCourtBindDoorplateBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>确定</span>
						</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- /.modal-dialog -->
</div>

<script type="text/javascript">
	var courtRoleBindScripts = [ null, null ];
	var $courtRoleBindContainer = $('#courtRoleBind_container');
	var courtRoleBindGrid = null;
	var courtRoleBindDoorplateGrid=null;
	var $validatecourtRoleBindForm = null;

	$('.page-content-area').ace_ajax('loadScripts',courtRoleBindScripts,
		function() {
			var grid_selector = "#courtRoleBind_grid-table";
			var pager_selector = "#courtRoleBind_grid-pager";

			var colNames = [ '', '角色名称', '小区名称', '业主姓名','门牌号', '栋','单元','操作' ];
			createCourtRoleBindGrid();

			$validatecourtRoleBindForm = $('#courtRoleBindForm', $courtRoleBindContainer).validate({
				onsubmit : false,
				rules : {
					doorplateNo : {
						required : true
					}
				}
			});
			
			$("#searchCourtRoleBindDoorplateBtn").on("click",function(){
				createCourtRoleBindDoorplateGrid();
			})
			
			$("#submitCourtBindDoorplateBtn").on("click",function(){
	            var rowid = courtRoleBindDoorplateGrid.getGridParam("selrow");
	            var selectDoorplateData=courtRoleBindDoorplateGrid.getRowData(rowid);
	            $("#courtRoleBindDoorplate").val(selectDoorplateData.doorplateNo);
	            $("#courtRoleBindDoorplateId").val(selectDoorplateData.id);
	            $('#checkCourtRoleBindDoorplateGridDiv', $courtRoleBindContainer).modal("hide");
			})

			$('#submitcourtRoleBindBtn').click(
				function() {
					if (!$validatecourtRoleBindForm.checkForm()) {
						$validatecourtRoleBindForm.defaultShowErrors();
						return;
					}
					var url = $(this).attr("url");
					var id = $('#courtRoleBindId',$("#courtRoleBindForm", $courtRoleBindContainer)).val();
					var message = "";
					if (id && id != "") {
						message = "确定要修改这条记录吗？"
					} else {
						message = "确定要添加一条记录吗？"
					}
					$.loy.confirm(message, function() {
						$.loy.ajax({
							url : url,
							data : $("#courtRoleBindForm",$courtRoleBindContainer).serialize(),
							success : function(data) {
								$('#courtRoleBindModalDiv',$courtRoleBindContainer).modal("hide");
								courtRoleBindGrid.jqGrid().trigger("reloadGrid");
							},
							error : function(data) {
								alert("发生错误");
							}
						});
					});
			});

			function createCourtRoleBindGrid() {
				courtRoleBindGrid = jQuery(grid_selector).loyGrid(
				{
					url : 'ywhBind/findAll',
					datatype : "json",
					mtype : 'GET',
					colNames : colNames,
					colModel : [
							{
								name : 'id',
								index : 'id',
								sortable : false,
								width : 1,
								align : "center",
								editable : true,
								hidden : true
							},
							{
								name : 'roleName',
								index : 'roleName',
								sortable : false,
								width : 200,
								align : "center",
								editable : true
							},
							{
								name : 'courtName',
								index : 'courtName',
								sortable : false,
								width : 200,
								align : "center",
								editable : true
							},
							{
								name : 'proprietorName',
								index : 'proprietorName',
								sortable : false,
								width : 200,
								align : "center",
								editable : true
							},
							{
								name : 'doorplateNo',
								index : 'doorplateNo',
								sortable : false,
								width : 200,
								align : "center",
								editable : true
							},
							{
								name : 'building',
								index : 'building',
								sortable : false,
								width : 150,
								align : "center",
								editable : true
							},
							{
								name : 'unit',
								index : 'unit',
								sortable : false,
								width : 150,
								align : "center",
								editable : true
							},
							{
								name : '',
								index : '',
								width : 200,
								fixed : true,
								sortable : false,
								resize : false,
								align : "center",
								formatter : function(
										cellvalue,
										options,
										rowObject) {
									var button = '';
									if (hasPermissionByCode('resource:update')) {
										button += '<div title="'
												+ $.jgrid.nav.edittitle
												+ '" onclick=courtRoleBindEdit("'
												+ rowObject.id
												+ '");  style="float:left;margin-left:70px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ui-icon-pencil"></span></div>';
									}
									if (hasPermissionByCode('resource:del')) {
										var del = '<div title="'
												+ $.jgrid.nav.deltitle
												+ '" onclick=courtRoleBindDel("'
												+ rowObject.id
												+ '");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-trash-o red"></span></div>';
										button += del;
									}
									return button;
								}
							} ],
					pager : pager_selector,
					width : $(this).jqGrid('setGridWidth', $(".page-content").width()),
					height : getGridDefaultHeight(),
				}).loyGrid('navGrid',
				'#courtRoleBind_grid-pager', {
					"addfunc" : function() {
						courtRoleBindAdd('');
					},
					view : false,
					add : true,
					edit : false,
					del : false,
					excel : false
				});
				courtRoleBindGrid.jqGrid('setFrozenColumns');
			}

		});
	function clearCourtForm() {
		$validatecourtRoleBindForm.resetForm();
		$('#courtRoleBindId', $courtRoleBindContainer).val('');
		$("#courtRoleBindDoorplate", $courtRoleBindContainer).val('');
		$('#courtRoleBindDoorplateId', $courtRoleBindContainer).val('');
		
	}
	function courtRoleBindEdit(id) {
		clearCourtForm();
		$("#courtRoleBindTitle").text("修改业委会角色");
		$('#submitcourtRoleBindBtn', $courtRoleBindContainer).attr("url", "ywhBind/addywhBindInfo");
		$('#courtRoleBindModalDiv', $courtRoleBindContainer).modal("show");
		$.loy.ajax({
			url : 'ywhBind/findOne',
			shade : false,
			data : {
				id : id
			},
			success : function(data) {
				var result = data.data;
				$('#courtRoleBindId', $courtRoleBindContainer).val(result.id ? result.id : '');
				$('#courtRoleBindDoorplate', $courtRoleBindContainer).val(result.doorplateNo ? result.doorplateNo : '');
				$('#courtRoleBindDoorplateId', $courtRoleBindContainer).val(result.doorPlateId ? result.doorPlateId : '');
				$.loy.ajax({
					url : "/ywh/findAllNoPage",
					type : 'GET',
					data : {},
					success : function(data) {
						var result2=data.data;
						$("#roleChoseSelect").empty();
						var option=$("<option></option>");
						for (var i = 0; i < result2.length; i++) {
							var option=$("<option></option>");
							option.val(result2[i].id);
							option.text(result2[i].roleName);
							if(result2[i].id==result.roleId){
								option.attr("selected","selected");
							}
							$("#roleChoseSelect").append(option);
						}
						$('#courtRoleBindModalDiv', $courtRoleBindContainer).modal("show");
					},
					error : function(data) {
						alert("加载小区列表失败");
					}
			   });
			}
		});
	}
	function courtRoleBindAdd(parentId) {
		clearCourtForm();
		$("#courtRoleBindTitle").text("添加业委会角色");
		$('#submitcourtRoleBindBtn', $courtRoleBindContainer).attr("url", "ywhBind/addywhBindInfo");
		//加载下拉框
		$.loy.ajax({
			url : "/ywh/findAllNoPage",
			type : 'GET',
			data : {},
			success : function(data) {
				var result=data.data;
				$("#roleChoseSelect").empty();
				var option=$("<option></option>");
				for (var i = 0; i < result.length; i++) {
					var option=$("<option></option>");
					option.val(result[i].id);
					option.text(result[i].roleName);
					$("#roleChoseSelect").append(option);
				}
				$('#courtRoleBindModalDiv', $courtRoleBindContainer).modal("show");
			},
			error : function(data) {
				alert("加载小区列表失败");
			}
	   });
	}
	function courtRoleBindDel(id) {
		var that = this;
		$.loy.confirm($.i18n.prop('confirm_info_del'), function() {
			$.loy.ajax({
				url : 'ywhBind/delywhBindInfo',
				data : {
					id : id
				},
				success : function(data) {
					that.refreshGrid();
				}
			});
		});
	}
	function refreshGrid() {
		courtRoleBindGrid.jqGrid().trigger("reloadGrid");
	}
	function choseRoleBindDoorplate(){
		$('#checkCourtRoleBindDoorplateGridDiv', $courtRoleBindContainer).modal("show");
		createCourtRoleBindDoorplateGrid();
	}
	function createCourtRoleBindDoorplateGrid(){
		var grid_selector4 = "#courtRoleBindDoorplate_grid-table";
		var pager_selector4 = "#courtRoleBindDoorplate_grid-pager";
		var colNames = ['','小区名称','业主姓名','门牌号','单元号','楼栋号'];
		$(grid_selector4).jqGrid('GridUnload');
		courtRoleBindDoorplateGrid = jQuery(grid_selector4).loyGrid({
			url : 'mp/findAll',
			datatype : "json",
			postData: {
				"proprietorName" : $("#CourtRoleBindDoorplateProprietorName").val()
			},
			mtype : 'GET',
			colNames : colNames,
			multiselect: false,  
			colModel : [
				{
					name : 'id',
					index : 'id',
					sortable : false,
					width : 15,
					align : "center",
					editable : true,
					hidden : true
				},
				{
					name : 'courtName',
					index : 'courtName',
					sortable : false,
					width : 2,
					align : "center",
					editable : true
				},
				{
					name : 'proprietorName',
					index : 'proprietorName',
					sortable : false,
					width : 1,
					align : "center",
					editable : true,
					formatter : function(
							cellvalue,
							options,
							rowObject) {
						if(cellvalue==null || cellvalue==""){
							return "暂无业主";
						}else{
							return cellvalue;
						}
					}
				},
				{
					name : 'doorplateNo',
					index : 'doorplateNo',
					sortable : false,
					width : 1,
					align : "center",
					editable : true
				},
				{
					name : 'unit',
					index : 'unit',
					sortable : false,
					width : 1,
					align : "center",
					editable : true
				},
				{
					name : 'building',
					index : 'building',
					sortable : false,
					width : 1,
					align : "center",
					editable : true
				}],
					pager : pager_selector4,
					gridComplete:function(){
			        	$(this).jqGrid('setGridWidth', 560);
	                },
					height : '363px',
				}).loyGrid('navGrid',pager_selector4, {
					view : false,
					add : false,
					edit : false,
					del : false,
					refresh : false,
					excel : false
				});
		courtRoleBindDoorplateGrid.jqGrid('setFrozenColumns');
	}
</script>